<%@LANGUAGE="VBSCRIPT" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="icon" href="/images/color_icon.ico" type="image/x-icon">
<title>Color Picker</title>

<script type="text/javascript">
function cmouseover(num){
	dc=document.getElementById("displaycell")
	
	dc.style.backgroundColor="#" + num
	dc.innerHTML="#" + num.toUpperCase()
}

function cclick(num){
	itimer=window.setInterval("animateborder()",1000)
	if(itimer) {window.clearInterval(itimer)}
	cc=document.getElementById("chosencell")
	ph=document.getElementById("selPH")
	c=document.getElementById("c" + num)

	if (ph.value != ""){ 
		oldc=document.getElementById("c" + ph.value)
		oldc.style.borderColor="#000000"; 
		oldc.style.borderStyle="solid";
		oldc.style.visibility="visible";
		
	}
	
	c.style.borderColor="#ffffff"
	c.style.borderStyle="solid" 
	
	ph.value=num
	cc.style.backgroundColor="#" + num
	cc.innerHTML="#" + num.toUpperCase();
	
	
	
}

function animateborder(){
	ph=document.getElementById("selPH")
	c=document.getElementById("c" & ph.value)
	
	if (c.style.borderColor =="#000000"){
		c.style.borderColor="#ffffff"
	}
	else{
		c.style.borderColor="#000000"
	}
}

function btnok_click(){
	cc=document.getElementById("chosencell")
	if (String(cc.innerHTML).substring(0,1) != "#"){
		alert("No Color Chosen.");
	}
	else{
		window.returnValue=cc.innerHTML;
		window.close();
	}
}

function btncancel_click(){
	window.close();
}
</script>

<style type="text/css">
body { margin:0px; background:#dddddd }
</style>
</head>

<body>
<script type="text/javascript">

ar1=new Array("00","33","66","99","aa","cc","ff")
ar2=new Array("00","33","99","cc","ff")
ar3=new Array("00","11","22","33","44","55","66","77","88","99","aa","bb","cc","dd","ee","ff")

h = "<table border=1 bgcolor=#dddddd style='font-size:8px'>"
for (f=0;f <= ar3.length-1;f++){
	h += "<tr>\n"
	for (s=0;s <= ar2.length-1;s++){
		
		for (t=0;t <= ar1.length-1;t++){
			c1=ar3[f]
			c2=ar2[s]
			c3=ar1[t]
			c= c1 + c2 + c3
			h += "<td bgcolor='#" + c + "' onmouseover= " + String.fromCharCode(34) + "cmouseover('" + c + "')" +String.fromCharCode(34) + " onclick=" + String.fromCharCode(34) + "cclick('" + c + "')" + String.fromCharCode(34) + " style='cursor:pointer; width:20; height:20; border-style:solid; border-color:#000000; border-width:2px' id='c" + c + "'> &nbsp;&nbsp;&nbsp;&nbsp; </td>\n"
		} //next
		
	} //next
	h += "</tr>\n"
} //next
h += "<tr>\n" 

h += "<td colspan=3 style='border:none; font-size:10px; font-family:Arial, Helvetica, sans-serif;' align='right'>Preview:</td>"

h += "<td colspan=6 id='displaycell' style='font-size:14px; font-family:Arial, Helvetica, sans-serif;  text-align:center' align='left'> &nbsp; </td>\n" 

h += "<td colspan=7 style='border:none; font-size:10px; font-family:Arial, Helvetica, sans-serif;' align='right'>Selected:</td>"

h += "<td colspan=6 id='chosencell' style='font-size:14px; font-family:Arial, Helvetica, sans-serif;  text-align:center' align='left'> &nbsp; </td>\n" 

h += "<td colspan=13 style='border:none;' align='right'>\n"

h += "<input type=button id=btnok value='   OK    ' onclick='btnok_click()'> &nbsp;\n"
h += "<input type=button id=btncancel value=CANCEL onclick='btncancel_click()'>\n"
h += "<input type=hidden id=selPH>\n"
h += "</td></tr>"
h += "</table>"

document.write (h)
</script>

</body>
</html>
